* {box-sizing: border-box;}

.column {float: left; padding: 10px;}

.left {width: 75%;}

.right {width: 25%;}

.row:after {content: ""; display: table; clear: both;}

@media screen and (max-width: 1024px) {
.column {
  width: 100%;
 }
}

h3 {color: #1a1a1a; margin-top: 10px;}

h2::after {
  background: linear-gradient(to right, #1a1a1a 0px, #1a1a1a 10px, #124e84 10px, #124e84 80px);
  bottom: 10px;
  display: block;
  content: "";
  height: 2px;
  margin: 10px 0 20px 0;
  width: 80px;
}

.fa-pennant {margin-left: 5px;} .fa-pennant:hover {animation: wobble 2s ease infinite;}

@keyframes wobble {
  0% { transform: translateX(0%); }
  15% { transform: translateX(-25%) rotate(-5deg); }
  30% { transform: translateX(20%) rotate(3deg); }
  45% { transform: translateX(-15%) rotate(-3deg); }
  60% { transform: translateX(10%) rotate(2deg); }
  75% { transform: translateX(-5%) rotate(-1deg); }
  100% { transform: translateX(0%); }
}

body {
    background-color: #eeeef0;
    background-image: -webkit-repeating-radial-gradient(center center, rgba(0,0,0,.1), rgba(0,0,0,.1) 1px, transparent 1px, transparent 100%);
    background-image: -moz-repeating-radial-gradient(center center, rgba(0,0,0,.1), rgba(0,0,0,.1) 1px, transparent 1px, transparent 100%);
    background-image: -ms-repeating-radial-gradient(center center, rgba(0,0,0,.1), rgba(0,0,0,.1) 1px, transparent 1px, transparent 100%);
    background-image: repeating-radial-gradient(center center, rgba(0,0,0,.1), rgba(0,0,0,.1) 1px, transparent 1px, transparent 100%);
    -webkit-background-size: 6px 6px;
    -moz-background-size: 6px 6px;
    background-size: 6px 6px;
}

.submenu {
  background-color: #eeeef0;
  border: 1px solid #dfdfe1;
  padding: 10px;
}

.hero {
  padding: 0;
  width: 100%;
  position: relative;
  max-height: 225px;
  overflow: hidden;
  transition: transform .1s, visibility .1s ease-in;
}

.hero img {
  display: inline-block;
  transition: all .5s;
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}

.hero img:hover {
  transform: scale(1.15);
}

ul.seasons {list-style-type: none; background: #fdfdff; margin: 0 0 15px 0 !important; padding: 0 !important;}
ul.seasons li:not(:first-child) {border-top: 0;}
ul.seasons li {padding: 7.5px 7.5px 7.5px 10.5px; border: 1px solid #dfdfe1; color: #1a1a1a;}
ul.seasons a {text-decoration: none !important; color: #1a1a1a; transition-duration: .25s;}
ul.seasons i {margin-right: 7.5px;}
ul.seasons a:hover {color: #124e84; padding-left: 7.5px;}

.subheader {
  color: #1a1a1a;
  font-size: 1.2em;
  font-style: italic;
  margin-bottom: 20px;
}

table.season {
  cursor: default;
  margin: 0 auto 20px auto;
  border-collapse: collapse;
  text-rendering: optimizeLegibility;
  border-radius: 2.5px;
  width: 100%;
}

table.season thead tr {background: #124e84; color: white; border-bottom: 2px solid #1b76c7; cursor: default;}
table.season thead tr th {font-size: 1em; font-weight: bold; padding: .3em .5em;}

table.season thead tr th:first-child {text-align: left; width: 30%;}
table.season thead tr th:nth-child(2) {text-align: center; width: 10%}
table.season thead tr th:nth-child(3) {text-align: center; width: 10%;}
table.season thead tr th:nth-child(4) {text-align: right; width: 15%;}
table.season thead tr th:nth-child(5) {text-align: left; width: 17.5%;}
table.season thead tr th:last-child {text-align: right; width: 17.5%;}

table.season tbody tr {color: #1a1a1a; transition-duration: .05s;}
table.season tbody tr:hover {font-weight: 500 !important; background: #f9ca24 !important;}
table.season tbody tr td {font-size: .8em; padding: .4em .5em;}
table.season tbody tr:nth-child(odd) {background: #f7f7f7;}
table.season tbody tr:nth-child(even) {background: #f0f0f0;}

table.season tbody tr td:first-child {text-align: left; width: 30%;}
table.season tbody tr td:nth-child(2) {text-align: center; width: 10%}
table.season tbody tr td:nth-child(3) {text-align: center; width: 10%;}
table.season tbody tr td:nth-child(4) {text-align: right; width: 15%;}
table.season tbody tr td:nth-child(5) {text-align: left; width: 17.5%;}
table.season tbody tr td:last-child {text-align: right; width: 17.5%;}
table.season tbody i {color: #1b76c7; margin-left: 5px; font-size: 12px;}

@media screen and (max-width: 869px) {
  table.season thead {display: none;}
  table.season tbody td {display: block; padding: .6rem; width: 100% !important; text-align: left !important;}
  table.season tbody tr td:first-child {background: #124e84; color: #fff; font-weight: bold;}
  table.season tbody td:before {content: attr(data-th); font-weight: bold; display: inline-block; width: 6rem;}
  table.season tbody i {color: white; font-size: 10x;}
}


.list-container {
  background: transparent;
  padding: 0 10px 10px 10px;
  max-width: 1004px;
  margin: 0 auto;
  font-family: "Roboto", sans-serif;
}

.list-container .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.list-container .col {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 33.33%;
  flex: 0 0 33.33%;
  max-width: 33.33%;
}
.list-container .card-container {
  background-color: #124e84;
  color: #fff;
  margin: 10px;
  padding: 10px;
}
.list-container .card {
  border: 1px solid #f9ca24;
  padding: 10px 10px 5px 10px;
}

.list-container img {
  float: left;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top;
  margin-right: 10px;
  transition-duration: .25s;
}

.list-container img:hover {
  filter: brightness(1.1);
}

.list-container h4 {
  margin-top: 0;
  margin-bottom: 0;
}

.list-container h1 {
  line-height: 26px;
  text-transform: uppercase;
  margin-top: 0;
}

@media (max-width: 1299px) {
  .list-container h1 {font-size: 1.5em;}
}

@media (max-width: 1219px) {
  .list-container h1 {font-size: 1.25em;}
}

@media (max-width: 1098px) {
  .list-container h1 {font-size: 2em;}
}

.list-container .card__content {
  margin-top: 13px;
}

.list-container ul {
  border-top: 1px solid #1b76c7;
  padding-left: 0;
  padding-top: 7px;
  text-align: center;
  position: relative;
}

.list-container ul::before {
  content: "";
  border-top: 3px solid white;
  position: absolute;
  left: 0;
  right: 0;
  width: 27px;
  top: -2px;
  margin: auto;
}

.list-container li {
  margin-bottom: 10px;
  display: flex;
  width: 100%;
  font-size: 12px;
  list-style: none;
}

.list-container i {
  margin-left: 5px;
}

.list-container li:first-child {
  padding-top: 5px;
}

.list-container li:last-child {
  border-top: 1px solid #f9ca24;
  padding-top: 10px;
}

.list-container li:last-child span {
  color: white;
  text-transform: uppercase;
}

.list-container li span:first-child {
  text-align: right;
  width: 62.5%;
  font-weight: 600;
}

.list-container li span:last-child {
  width: 37.5%;
  text-align: left;
  color: white;
  margin-left: 12px;
}

.list-container li:last-child span {
  color: #f9ca24;
}

.list-container ul li span i {display: inline; padding-left: 2px;}

@media (min-width: 725px) and (max-width: 1098px) {
  .list-container .col {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (max-width: 724px) {
  .list-container .col {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .list-container li span:first-child {width: 50%;} .list-container li span:last-child {width: 50%;}
}

@media (max-width: 539px) {
  .list-container li span:first-child {width: 60%;} .list-container li span:last-child {width: 40%;}
}